.authContainer {
  @apply relative flex justify-center items-center w-screen h-screen bg-no-repeat bg-[#a7c7be] bg-cover;
  background-image: url(../../assets/img/background/bg-auth.png);

  :global {
    .authCard {
      // 适配大屏幕设备
      @apply relative flex w-[768px] max-w-full min-h-[480px] bg-white rounded-lg;
      box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
      // 适配小屏设备
      @apply sm:flex-col sm:items-center sm:w-full sm:h-full sm:shadow-none;
    }
  }
}

// 激活滑块
.activeSlider {
  background: linear-gradient(to left, #9dc8c8, #58c9b9, #519d9e);
  transition: all 0.3s;
  @apply absolute flex justify-center flex-col items-center w-1/2 min-h-[480px] text-white rounded-lg z-10;
  @apply sm:w-full sm:rounded-none;
}

// 注册卡片
.registerCard {
  @apply flex flex-col justify-center items-center w-1/2 min-h-[480px] rounded-l-lg;
  @apply sm:w-full sm:h-[50vh] sm:rounded-none;

  :global {
    .submitBtn {
      @apply flex justify-center items-center w-32 h-9 mt-4 sm:mt-0 bg-[#FF4B2B] text-white text-xs rounded-3xl;
      border: 1px solid #fff;
      background: linear-gradient(to left, #9dc8c8, #58c9b9, #519d9e);

      &:hover {
        border-color: #fff !important;
        color: #fff !important;
      }
    }
  }
}

// 登录卡片
.loginCard {
  @apply flex flex-col justify-center items-center w-1/2 min-h-[480px] rounded-r-lg;
  @apply sm:w-full sm:h-[50vh] sm:rounded-none;

  :global {
    .submitBtn {
      @apply flex justify-center items-center w-32 h-9 mt-4 sm:mt-0 bg-[#FF4B2B] text-white text-xs rounded-3xl;
      border: 1px solid #fff;
      background: linear-gradient(to left, #9dc8c8, #58c9b9, #519d9e);

      &:hover {
        border-color: #fff !important;
        color: #fff !important;
      }
    }
  }
}
